import React, {
    PureComponent
} from "react";
import {
    Platform,
    StyleSheet,
    Text,
    View,
    Button,
    ScrollView,
    Image,
    Dimensions,
    TouchableOpacity, DeviceEventEmitter,
    SafeAreaView,
} from "react-native";

import RefreshListView, {
    RefreshState
} from "react-native-refresh-list-view";

import ZiliaoCell from '../../widget/course/ZiliaoCell'
import api from '../../api/api'
import method from '../../api/method'
import {fetchGetRequest} from '../../api/NetworkTool'
import NetTool from '../../api/NetTool'
import PDFListScene from "./PDFListScene";
import CommonEmptyView from '../../widget/CommonEmptyView'

const {width, height} = Dimensions.get('window')
type Props = {
    navigation:any,
}
type State = {
    data: Array < Object > ,
    refreshState: number,
}
export default class ZiLiaoScene extends PureComponent<Props>{

    static navigationOptions = ({
                                    navigation
                                }: any) => ({
        headerTintColor:'#333333',
        headerStyle:{backgroundColor:'white'},
        title: '资料',
        headerLeft: <TouchableOpacity onPress={()=>{
            navigation.goBack()
        }}>
            <Image style={{marginLeft:12}} source={require('../../../res/img/gobal_back.png')}/>
        </TouchableOpacity>,
        headerRight:<Text/>
    })
    constructor(props) {
        super(props)
        this.state = {
            data: [],
            refreshState: RefreshState.Idle,
        }
    }
    componentDidMount() {
        this.requestFirstPage()
    }
    requestData = async() => {

        const {
            info
        } = this.props.navigation.state.params

        let params = {
            courseId: info.id,
        }
        let json = await NetTool.fetchGetRequest(api.getUserCourse, method.get,params)


        let dataList = json.lessons.map((info) => {
            return {
                id: info.id,
                title: info.title,
            }
        })


        return dataList
    }


    requestFirstPage = async() => {

        try {
            this.setState({refreshState: RefreshState.HeaderRefreshing})
            let dataList = await this.requestData()

            this.setState({
                data: dataList,
                refreshState: RefreshState.Idle,
            })
        } catch (error) {
            this.setState({
                refreshState: RefreshState.Failure,
            })
        }
    }
    requestNextPage = async() => {
    }

    keyExtractor = (item: Object, index: number) => {
        return index + ''
    }
    renderCell = (rowData: any) => {

        return (
            <ZiliaoCell navigation={this.props.navigation} info={rowData} onPress={()=>{
                this.props.navigation.navigate('PDFListScene',{lesson_id:rowData.item.id})
            }}/>
        )
    }
    render() {
        return (

            <SafeAreaView style={{backgroundColor:'white',flex:1}}>

                <RefreshListView
                    style={{marginTop:15}}
                    ListHeaderComponent={() => (
                        !this.state.data.length?
                            <CommonEmptyView height={(height-200)} tip={'暂无资料'} source={require('../../../res/img/minecourse/course_ziliao.png')}/>
                            : null)
                    }
                    data={this.state.data}
                    renderItem={this.renderCell}
                    keyExtractor={this.keyExtractor}
                    refreshState={this.state.refreshState}
                    onHeaderRefresh={this.requestFirstPage}
                    onFooterRefresh={this.requestNextPage}
                    ItemSeparatorComponent={()=><View style={{width:width,height:8,backgroundColor:'#FFFFFF'}}/>}
                />
            </SafeAreaView>

        );
    }
}